<template>
  <el-dialog
    top="30px"
    width="1000px"
    append-to-body
    :close-on-click-modal="false"
    :before-close="beforeClose"
    :visible.sync="visible"
  >
    <el-tabs v-model="activeName" v-loading="loading">
      <el-tab-pane label="委托担保合同" name="first">
        <contract-entrust-self
          v-if="+related.gua_type === 2"
          :re-sign="true"
          :related-data="related"
          @close="beforeClose"
        ></contract-entrust-self>
        <contract-entrust v-else :related-data="related" @close="beforeClose"></contract-entrust>
      </el-tab-pane>
      <el-tab-pane label="反担保合同" name="secoend">
        <contract-guard :query-id="queryId" :related-data="related"></contract-guard>
      </el-tab-pane>
      <el-tab-pane label="合同审批">
        <approve-res :related-data="related"></approve-res>
      </el-tab-pane>
      <el-tab-pane label="联保函">
        <union-letter :related-data="related"></union-letter>
      </el-tab-pane>
      <el-tab-pane label="放款通知书">
        <loan-notice :query-id="queryId"></loan-notice>
      </el-tab-pane>
      <el-tab-pane label="合同重做历史">
        <contract-history :query-id="queryId"></contract-history>
      </el-tab-pane>
    </el-tabs>
  </el-dialog>
</template>

<script>
import ContractEntrustSelf from '@/credit/views/city/self/components/contractApprove/ContractEntrust'
import ContractEntrust from '@/credit/views/county/unionProvince/components/ContractEntrust'
import ContractGuard from '@/credit/views/county/unionProvince/components/ContractGuard'
import ApproveRes from '@/cadmin/views/org/components/contracApproval/ApproveRes'
import ContractHistory from '@/cadmin/views/org/components/contracApproval/ContractHistory'
import UnionLetter from '@/cadmin/views/org/components/contracApproval/UnionLetter'
import LoanNotice from '@/cadmin/views/org/components/contracApproval/LoanNotice'
export default {
  props: {
    visible: Boolean,
    queryId: String,
  },
  components: {
    ContractEntrust,
    ContractGuard,
    ApproveRes,
    ContractHistory,
    UnionLetter,
    LoanNotice,
    ContractEntrustSelf,
  },
  data() {
    return {
      activeName: 'first',
      loading: false,
      related: {},
    }
  },
  computed: {},
  watch: {
    queryId: {
      handler: function () {
        this.getData()
        this.$store.dispatch('getEntrustContract', this.queryId)
      },
      immediate: true,
    },
  },
  created() {},
  methods: {
    getData() {
      this.related = {}
      if (!this.queryId) {
        return
      }
      this.loading = true
      this.$api
        .getData(this.$serviceName, 'customer_related', {
          'customer_related_id.eq': this.queryId,
        })
        .then(res => {
          this.related = res?.data?.[0] ?? {}
        })
        .finally(() => {
          this.loading = false
        })
    },
    beforeClose() {
      this.$emit('update:visible', false)
    },
    handleSuccess() {
      this.$emit('success', true)
      this.beforeClose()
    },
  },
}
</script>
<style lang="scss" scoped></style>
